Creating Skins - Reference
Welcome to the new Wintropy 2 interface! Wintropy 2.0 now supports full skinning. This is a quick reference on creating skins for Dacris Software products. We have provided several skins as examples.
The Requirements for All Wintropy Skins
- All files of the skin, including all sounds and
reserved files, are mandatory! They must exist!
- Skin.def file must contain complete skin definition (all required values)
- Colors.ini is not required but may be included for backwards compatibility
- All graphics files MUST be of 256 colors or less! (24-bit color graphics will
cause an error because of Windows' DIB limitations)
What you will need:
- A painting program that supports image
stretching and color reduction (such as Photoshop or Paint Shop Pro)
- A sound recording or conversion application
- This documentation handy
Making the skin
The Definition File
Every Wintropy skin has a 'Skin.def' file. This
file is located in the skin's directory, which can be found in the Interface
subdirectory of the product.
Here are the available options for the Skin.def file:
| Option name | Description | Section | Required? | Possible values |
| Name | Specifies the name of the skin, as it is displayed in the skin selector. | [Skin] | Yes | Any string, doesn't have to be directory name |
| Wintropy | Specifies the minimum version of Wintropy required by this skin. | [Skin] | No | 2 or higher, the version number; currently reserved for future versions (2.1, etc.) |
| NoStretchX | Specifies the starting X value of the Top.bmp file where the bitmap is not stretched. | [Titlebar] | No | Any number that is an X coordinate within the Top.bmp file |
| NoStretchW | Specifies the width of the non-stretch area of Top.bmp | [Titlebar] | No | Any number |
| ActiveTextR | Specifies the RED value of the active title text color | [Titlebar] | No | Any number under 256 |
| ActiveTextG | Specifies the GREEN value of the active title text color | [Titlebar] | No | Any number under 256 |
| ActiveTextB | Specifies the BLUE value of the active title text color | [Titlebar] | No | Any number under 256 |
| SelTextR | Specifies the RED value of the menu selected text | [Menu] | No | Any number under 256 |
| SelTextG | Specifies the GREEN value of the menu selected text | [Menu] | No | Any number under 256 |
| SelTextB | Specifies the BLUE value of the menu selected text | [Menu] | No | Any number under 256 |
| ShowWindowAnim | Specifies the window open animation | [Transitions] | No | A number identifier: 0 = no
animation 1 = slide in 2 = fade in |
| HideWindowAnim | Specifies the window close animation | [Transitions] | No | A number identifier: 0 = no animation 1 = slide out 2 = fade out |
| ShowWindowAnimDuration | Specifies the window open animation duration | [Transitions] | No | A value that specifies the number of milliseconds |
| HideWindowAnimDuration | Specifies the window close animation duration | [Transitions] | No | A value that specifies the number of milliseconds |
| File | Description/Role | Specifications (size) of 1 variation* | # or variations | Description of variations |
| Top.bmp | The top border and titlebar background | Height = 23 pixels | 2 (vertical, top to bottom) | 1st = Active window 2nd = Inactive window |
| Bottom.bmp | The bottom border of the window | Height = 4 pixels | 2 (vertical, top to bottom) | 1st = Active window 2nd = Inactive window |
| Left.bmp | The left border of the window | Width = 4 pixels Min Height = 10 pixels Top and bottom 4 pixels are not stretched |
2 (horizontal, left to right) | 1st = Active window 2nd = Inactive window |
| Right.bmp | The right border of the window | Width = 4 pixels Min Height = 10 pixels Top and bottom 4 pixels are not stretched |
2 (horizontal, left to right) | 1st = Active window 2nd = Inactive window |
| Close.bmp | The close button of the window (right-hand corner) | Width = 17 pixels Height = 17 pixels |
6 (horizontal, left to right) | 1st = Normal, active 2nd = Pressed, active 3rd = Hover, active 4th = Normal, inactive 5th = Pressed, inactive 6th = Hover, inactive |
| Maximize.bmp | The maximize button of the window, remains the same even if window is already maximized | Width = 17 pixels Height = 17 pixels |
6 (horizontal, left to right) | 1st = Normal, active 2nd = Pressed, active 3rd = Hover, active 4th = Normal, inactive 5th = Pressed, inactive 6th = Hover, inactive |
| Minimize.bmp | The minimize button of the window | Width = 17 pixels Height = 17 pixels |
6 (horizontal, left to right) | 1st = Normal, active 2nd = Pressed, active 3rd = Hover, active 4th = Normal, inactive 5th = Pressed, inactive 6th = Hover, inactive |
| Icon.bmp | The icon (system menu) on the left-hand corner | Width = 16 pixels Height = 16 pixels |
6 (horizontal, left to right) | 1st = Normal, active 2nd = Pressed, active 3rd = Hover, active 4th = Normal, inactive 5th = Pressed, inactive 6th = Hover, inactive |
| Help.bmp | The context-help button found on some windows | Width = 17 pixels Height = 17 pixels |
6 (horizontal, left to right) | 1st = Normal, active 2nd = Pressed, active 3rd = Hover, active 4th = Normal, inactive 5th = Pressed, inactive 6th = Hover, inactive |
| Buttons.bmp | All the buttons found on windows and dialog boxes | Width = 20 pixels Height = 19 pixels 1st 3 pixels on every side are borders, not stretched |
5 (horizontal, left to right) | 1st = Normal 2nd = Pressed 3rd = Disabled 4th = Hover 5th = Focused |
| Radio.bmp | Radio button bitmap | Width = 15 pixels Height = 14-16 pixels |
6 (horizontal, left to right) | 1st = Normal 2nd = Checked 3rd = Disabled 4th = Disabled, Checked 5th = Unchecked, Hover 6th = Checked, Hover |
| CheckBox.bmp | Checkbox bitmap | Width = 15 pixels Height = 14-16 pixels |
6 (horizontal, left to right) | 1st = Normal 2nd = Checked 3rd = Disabled 4th = Disabled, Checked 5th = Unchecked, Hover 6th = Checked, Hover |
| DlgBgnd.bmp | Dialog box background | Can be any size, will be TILED | 1 | --- |
| MenuBar.bmp | Menu bar background | Width = ANY (tiled) Height = Multiple of 23 |
1 | --- |
| MenuBgnd.bmp | Menu popup background | Can be any size, will be TILED | 1 | --- |
| MenuSel.bmp | Menu selection background | Width = 20 Height = 19 1st 3 pixels on every side are borders, not stretched |
1 | --- |
| TBarBgnd.bmp | Toolbar background | Can be any size, will be TILED | 1 | --- |
| TBarSel.bmp | Toolbar button bitmap | Width = 20 Height = 19 1st 3 pixels on every side are borders, not stretched |
2 (horizontal, left to right) | 1st = Mouse over 2nd = Pressed |
| WinBgnd.bmp | The main window background for Dacris Benchmarks only | Can be any size, will be TILED | 1 | --- |
* One variation refers to one copy of the bitmap of one element (in one state), each bitmap must contain EXACTLY this number of variations for each state
| File name | Description | Typical length |
| BtnOver.wav | This sound occurs when the mouse moves over a push button | 0.1 to 0.5 seconds (short) |
| Close.wav | This sound occurs whenever a window is closed | 0.5 to 2 seconds (long) |
| Open.wav | This sound occurs whenever a window is open | 0.5 to 1 second (medium) |
| Over.wav | This sound occurs when the mouse moves over a toolbar button | 0.1 to 0.5 seconds |
| Popup.wav | This sound occurs when a menu pops up or opens | 0.1 to 0.5 seconds |
| Select.wav | This sound occurs when anything is selected (clicked) | 0.1 to 0.5 seconds |
The following elements apply to the Wintropy wizards. Also, some files may be used as elsewhere, please read below. These files are found in the Wizard subfolder of the skin.
| File name | Description and uses | Size |
| Bgnd.bmp | The default background for wizard pages | 364x240 |
| Bottom.bmp | The bottom background for the Next, Back, and Cancel wizard buttons | Width: 606 Height: ANYTHING (will be tiled) |
| Leftbar.bmp | The background for the bar that contains the names of the pages | 190x28 |
| Logo.bmp | The skin's logo which is also used in the skin selector dialog | 143x56 |
| Merlin.bmp | Reserved for now; leave blank, but you must create it | --- |
| Top.bmp | The top right-hand corner bitmap | 552x38 |
| Topbar.bmp | The top of the contents bar | 190x28 |
If you receive the following message: "Error! Can't find necessary skin files!"
Make sure you have created all the files listed in the tables above, with the correct names. Here is a checklist to doublecheck.
| \: Bottom.bmp, BtnOver.wav, Bullet.bmp, Buttons.bmp, CheckBox.bmp, Close.bmp, Close.wav, DlgBgnd.bmp, Help.bmp, Icon.bmp, Left.bmp, Maximize.bmp, MenuBar.bmp, MenuBgnd.bmp, MenuSel.bmp, Minimize.bmp, Open.wav, Over.wav, Popup.wav, Radio.bmp, Right.bmp, Select.wav, Skin.def, TBarBgnd.bmp, TBarSel.bmp, Top.bmp, WinBgnd.bmp \Wizard: bgnd.bmp, bottom.bmp, leftbar.bmp, |
Before you make your skin public, make sure you test it for any visual artifacts. If something doesn't look right, go back to the bitmap file and read over the specifications while analyzing it for possible errors.
To submit a skin to Dacris Software, just send it attached as a ZIP file (with directory structure) to contact@dacris.com. We will post it on our site within 24 hours.